<template>
  <div>
    <!--  调拨单列表  -->
    <div
      style="width: 100%;height: 40px; border: #E4E4E4 solid 2px;margin-top: 10px;padding: 5px;background-color: #F3F3F3">
      <span style="font-size: 12px;margin-left: 20px;">筛选查询</span>
    </div>
    <div style="background-color: #FFFFFF"><br>
      <div style="margin-left: 40px;margin-top: -15px;height: 40px">
        <el-input v-model="filters.names" style="width: 240px" placeholder="请输入单据号或备注" />
        <span style="margin-left: 80px">状态:</span>
        <div style="margin-left: 250px;margin-top: -32px">
          &nbsp;&nbsp;&nbsp;日期：
          <el-date-picker v-model="filters.billDate" type="daterange" range-separator="To" start-placeholder="开始时间"
            end-placeholder="结束时间" value-format="YYYY-MM-DD" />


          <el-button style="margin-left: 20px" @click="initData()">查询结果</el-button>
        </div>
      </div>
    </div>

    <div>
      <div
        style="width: 100%;height: 40px; border: #E4E4E4 solid 2px;margin-top: 10px;padding: 5px;background-color: #F3F3F3">
        <span style="font-size: 12px;margin-left: 20px">调拨列表</span>
        <!--工具条-->
        <div class="toolbar">
          <el-button type="primary" size="small" style="background-color: #60BFAE;border: #60BFAE"
            @click="router.push({ path: '/warehouse/save' })">新增调拨单
          </el-button>
          <el-button type="primary" size="small" @click="exportAllocateList()">导出</el-button>
          <el-button type="primary" size="small">打印</el-button>
          <el-button type="primary" size="small" @click="removeById()">删除</el-button>
          <el-button type="primary" size="small" @click="auditPur()">审核</el-button>
          <el-button type="primary" size="small" @click="NoauditPur()">反审核</el-button>
        </div>
      </div>
    </div>
    <!-- 数据列表 -->
    <el-table :data="tableData" style="width: 100%" border stripe @selection-change="removeId">
      <el-table-column type="selection" width="55" />
      <el-table-column prop="billDate" label="单据日期" width="200" header-align="center" align="center" />
      <el-table-column prop="code" label="单据编号" width="200" header-align="center" align="center" />
      <el-table-column prop="user" label="制单人" width="180" header-align="center" align="center" />
      <el-table-column prop="audit" label="审核人" width="180" header-align="center" align="center" />
      <el-table-column prop="note" label="备注" width="200" header-align="center" align="center" />
      <el-table-column label="操作" header-align="center" align="center">
        <template v-slot="{ row }">
          <el-button type="primary" style="margin-left: 16px" size="small" @click="fund(row)">
            查看
          </el-button>

          <el-button type="primary" style="margin-left: 16px" size="small" @click="edit(row.id)">
            编辑
          </el-button>
          <el-button type="primary" style="margin-left: 16px" @click="removeById(row.id)" size="small">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="margin:40px auto; width: 500px;">
      <el-pagination background @current-change="chgpg" @size-change="chg" :page-size="pageSize"
        :page-sizes="[10, 20, 30, 40, 50, 100]" layout="total,sizes,prev, pager, next,jumper" :total="total" />
    </div>
    <!-- 查看调拨单明细对话框 -->
    <View :visible="isshowFund" @close="isshowFund = false" ref="fundId"></View>
  </div>
</template>

<script setup >

import router from "@/router";
import { ref, onMounted } from "vue";
import { getUser } from "@/utils/session";
import { allocateList, DeleteAllocates, auditAllocate, exportAllocate } from "@/api/warehouse/list.jsx";
import { ElMessage, ElMessageBox } from "element-plus";
import { useRouter } from 'vue-router'
import host from "@/utils/env";

import View from "./View.vue"

const tableData = ref([])
const page = ref(1);//默认第一页
const pageSize = ref(10);//每页显示条数
const total = ref(0);//总条数

const adstatusOptions = ref([])
const statusOptions = ref([])

//编辑路由跳转
const route = useRouter();
function edit(id) {
  route.push("/allocate/edit/" + id)
}

/**
 * 分页
 * @param pg 第几页
 */
function chgpg(pg) {
  page.value = pg;
  initData();
}
/**
 * 分页
 * @param pgSize 每页多少条
 */
function chg(pgSize) {
  pageSize.value = pgSize;
  page.value = 1;
  initData();
}

//查看调拨单明细
const isshowFund = ref(false)
const fundId = ref(null)
function fund(row) {
  isshowFund.value = true
  fundId.value.fundXx(row.id)
}

//条件
const filters = ref({
  names: "",
  billDate: "",
  eid: getUser().eid
})

//表单数据获取
function initData() {
  if (filters.value.billDate == null) {
    filters.value.billDate = ""
  }
  let data = {
    page: page.value,
    pageSize: pageSize.value,
    names: filters.value.names,
    begin: filters.value.billDate[0],
    end: filters.value.billDate[1],
    eid: filters.value.eid
    }
    allocateList(data)
      .then(res => {
        if (res.code == 200) {
          tableData.value = res.data.list
          page.value = res.data.page
          pageSize.value = res.data.pageSize
          total.value = res.data.total
        }
      })
  
}

//批量删除
let rmData = []
//获取删除的id
function removeId(ids) {
  let data = [];
  for (let i = 0; i < ids.length; i++) {
    data.push(ids[i].id)
  }
  rmData = data
}

async function removeById(id) {

  if (isNumber(id)) {
    rmData.push(id)
  }

  ElMessageBox.confirm(
    '确认删除该调拨单信息吗，删除后该调拨单的明细也会全部消失无法撤回！',
    '调拨单删除确认',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(async () => {

      let res = await DeleteAllocates(rmData)
      initData()
      if (res.code == 200) {
        ElMessage({
          type: 'success',
          message: '删除成功',
        })
      }
    })
}


//审核调拨单
function auditPur() {
  ElMessageBox.confirm(
    '确认审核该调拨单吗？',
    '调拨单审核确认',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(async () => {
      let data = {
        "id": rmData,
        "auditStatus": 2,
        "auditor": getUser().username
      }
      if (rmData.length == 0) {
        ElMessage({
          type: 'warning',
          message: '请选择要审核的调拨单',
        })
        return
      }
      let res = await auditAllocate(data)
      initData()
      if (res.code == 200) {
        ElMessage({
          type: 'success',
          message: '审核成功',
        })


      }
    })
}

//反审核
function NoauditPur() {
  let data = {
    "id": rmData,
    "auditStatus": 3,
    "auditor": getUser().username
  }
  ElMessageBox.confirm(
    '确认拒绝该调拨单吗？',
    '调拨单审核确认',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(async () => {
      if (rmData.length == 0) {
        ElMessage({
          type: 'warning',
          message: '请选择要审核的调拨单',
        })
        return
      }
      let res = await auditAllocate(data)
      initData()
      if (res.code == 200) {
        ElMessage({
          type: 'success',
          message: '审核成功',
        })
      }
    })
}

//导出盘点记录
async function exportAllocateList() {
  let res = await exportAllocate({})
  if (res.code == 200) {
    window.open(host + res.data)
  }
}

//判断当前值是否是数字类型
function isNumber(value) {
  return !isNaN(parseFloat(value)) && isFinite(value);
}

onMounted(() => {
  initData();
})

</script>

<style scoped lang="scss">
.btn {
  color: #3399FF;
  margin-left: 10px;
  cursor: pointer;
}

.toolbar {
  float: right;
}

</style>
